{% extends "sentry/emails/base.html" %}

{% load timezone from tz %}
{% load sentry_avatars %}
{% load sentry_platforms %}
{% load sentry_helpers %}
{% load sentry_features %}
{% load sentry_assets %}
{% load i18n static %}

{% block head %}
  {{ block.super }}
  <style type="text/css" inline="false">
    @media only screen and (max-device-width: 480px) {
      /* Hide CTA in header on mobile */
      .header-buttons .integration-link {
        display: none !important;
      }
      .banner {
        display: none !important;
      }
    }
    @media only screen and (max-device-width: 768px) {
      .text-desktop-only {
        display: none !important;
      }
    }
  </style>
{% endblock %}

{% block preheader %}
  New issue detected in a release you contributed to.
{% endblock %}

{% block header %}
  <div class="header-with-buttons">
    {{ block.super }}
    <div class="header-buttons">
      <a href="{{ link }}" class="btn view-on-sentry">Open in Sentry</a>
    </div>
  </div>
{% endblock %}

{% block content %}
<div class="container">
  <div class="inner">
    <div>
      <table style="height:180px;background-color:rgba(108, 95, 199, 0.08);">
        <tr>
          <td style="text-align:center;vertical-align:bottom;font-size:24px;font-weight:600;">
            {% if regression %}
              Issue regressed in {{ last_release.version }}
            {% else %}
              New issue in {{ last_release.version }}
            {% endif %}
          </td>
        </tr>
        <tr>
          <td style="text-align:center;vertical-align:top;font-size:16px;font-weight:400;">
            You are getting this notification because you made a commit in this release
          </td>
        </tr>
      </table>
    </div>

    <table class="tg">
      <thead>
        <tr>
          <th colspan="3">
            <h3 class="new-event-title">
              {{event.title|truncatechars:50}}
            </h3>
          </th>
          <th style="font-size:18px;color:#2B2233;">{{ group.times_seen }}</th>
          <th style="font-size:18px;color:#2B2233;">{{ users_seen }}</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td style="padding:0;width:100px;">
            {% if regression %}
              <span class="badge regression">Regressed</span>
            {% else %}
              <span class="badge new">New issue</span>
            {% endif %}
          </td>
          <td style="padding:0;width:24px">
            <span class="platform">{% platform_avatar project.platform 16 %}</span>
          </td>
          <td style="padding:0;">
            <span style="text-transform:uppercase;">{{ project.slug }}</span> {% if environment %} in {{ environment }}{% endif %}
          </td>
          <td style="font-size:18px;color:#80708F;">Error</td>
          <td style="font-size:18px;color:#80708F;">Users</td>
        </tr>
      </tbody>
    </table>

    {% if enhanced_privacy %}
      <div class="event">
        <div class="event-id">ID: {{ event.event_id }}</div>
          {% if timezone %}
            <div class="event-date">{{ event.datetime|timezone:timezone|date:"N j, Y, g:i:s a e"}}</div>
          {% else %}
            <div class="event-date">{{ event.datetime|date:"N j, Y, g:i:s a e"}}</div>
          {% endif %}
      </div>

      <div class="notice">
        Details about this issue are not shown in this notification since enhanced privacy
        controls are enabled. For more details about this issue, <a href="{{ link }}">view this issue on Sentry</a>.
      </div>
    {% else %}

      {% if interfaces.Stacktrace %}
        <h4 class="new-title">Exception</h4>
        {{ interfaces.Stacktrace.html }}
      {% endif %}

      {% if tags %}
        <h4 class="new-title">Tags from Latest Event</h4>
        <ul class="new-event-contexts">
        {% if event_user %}
          <li>
            <table>
              <tr>
                <th rowspan="2">{% email_avatar event_user.name event_user.email 32 %}</th>
                <td><strong>{{ event_user.email }}</strong></td>
              </tr>
              <tr>
                <td>ID: {{ event_user.id }}</td>
              </tr>
            </table>
          </li>
        {% endif %}

        {% if contexts %}
          {% for context_key, context in contexts %}
            {% if context_key == 'browser' or context_key == 'client_os' or context_key == 'os' %}
              <li>
                <table>
                  <tr>
                    <th rowspan="2">{% letter_platform_svg context_key context_key 32 %}</th>
                    <td><strong>{{ context.name }}</strong></td>
                  </tr>
                  <tr>
                    <td>Version: {{ context.version }}</td>
                  </tr>
                </table>
              </li>
            {% endif %}
          {% endfor %}
        {% endif %}
        </ul>

        <ul class="new-tag-list">
        {% for tag_key, tag_value in tags %}
          <li>
            <div class="tag-key">{{ tag_key|as_tag_alias }}</div>
            <div class="tag-value">
            {% with query=tag_key|as_tag_alias|add:":\""|add:tag_value|add:"\""|urlencode %}
              <a href="{% absolute_uri '/organizations/{}/issues/' group.project.organization.slug %}?project={{ group.project.id }}&query={{ query }}">{{ tag_value|truncatechars:50 }}</a> {% if tag_value|is_url %}<a href="{{ tag_value }}" class="icon-share"></a>{% endif %}
            {% endwith %}
            </div>
          </li>
        {% endfor %}
        </ul>
      {% endif %}
    {% endif %}
  </div>
</div>
{% endblock %}
